/////////////////
// Semantic.gs // for Stylus: https://learnboost.github.com/stylus/
/////////////////

// Utility function — you should never need to modify this
// _gridsystem-width = (column-width + gutter-width) * columns
gridsystem-width(_columns = columns)
    (column-width + gutter-width) * _columns

// Set @total-width to 100% for a fluid layout
// total-width = gridsystem-width(columns)
total-width = 100%

//////////
// GRID //
//////////

body
    clearfix()
    width: 100%

row(_columns = columns)
    clearfix()
    display: block
    width: total-width * ((gutter-width + gridsystem-width(_columns)) / gridsystem-width(_columns))
    margin: 0 total-width * (((gutter-width * .5) / gridsystem-width(_columns)) * -1)

column(x, _columns = columns)
    display: inline
    float: left
    width: total-width * ((((gutter-width + column-width) * x) - gutter-width) / gridsystem-width(_columns))
    margin: 0 total-width * ((gutter-width * .5) / gridsystem-width(_columns))

push(offset = 1)
    margin-left: total-width * (((gutter-width + column-width) * offset) / gridsystem-width(columns))

pull(offset = 1)
    margin-right: total-width * (((gutter-width + column-width) * offset) / gridsystem-width(columns))